<template>
  <div class="userbox">
    <img class="userimg" src="@/assets/logo.png" alt="" srcset="">
    <p>欢迎登录</p>
    <el-button type="primary" class="outlogin" @click="outLogin">退出</el-button>
  </div>
</template>

<script>
export default {
  name:'username',
  methods: {
    outLogin () {
      localStorage.removeItem('userlist');
      this.$router.push('/login');
      this.$message({
        type: 'success',
        message: '退出成功',
        duration: 500
      });
    }
  }
};
</script>

<style lang="less" scoped>
.userbox {
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  .outlogin {
    margin-top: .3rem;
  }
}
  .userimg {
    width: .5rem;
    height: .5rem;
  }
</style>